<template>
  <div class="hospitalized">
    <h3 class="h3">建立住院患者档案</h3><br>
	<hr />
    <el-form :model="ruleForm" class="demo-ruleForm" ref="ruleForm" label-width="100px">
      <el-form :inline="true">
        <el-form-item label="姓名" prop="name">
          <el-input v-model="ruleForm.name"></el-input>
        </el-form-item>
        <el-form-item label="联系方式" prop="phone">
          <el-input v-model="ruleForm.phone"></el-input>
        </el-form-item>
      </el-form>
      <el-form :inline="true">
        <el-form-item label="年龄" prop="age">
          <el-input v-model="ruleForm.age"></el-input>
        </el-form-item>
        <el-form-item label="身份证号" prop="idcard">
          <el-input v-model="ruleForm.idcard"></el-input>
        </el-form-item>
      </el-form>
      <el-form :inline="true">
        <el-form-item label="性别" prop="sex">
          <el-radio-group v-model="ruleForm.sex">
            <el-radio :label="1" label-width="150px">男</el-radio>
            <el-radio :label="2" label-width="150px">女</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="家庭地址" prop="homeaddr" style="margin-left:35px;">
          <el-input type="textarea" v-model="ruleForm.homeaddr" class="address"></el-input>
        </el-form-item>
      </el-form>
      <el-form :inline="true">
        <el-form-item label="主治医生" prop="doctor">
          <el-select v-model="ruleForm.doctor" placeholder="请选择主治医生">
            <el-option v-for="item in doctors" :key="item.name" :label="item.name" :value="item.name"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="照看护士" prop="nurse">
          <el-select v-model="ruleForm.nurse" placeholder="请选择照看护士">
            <el-option v-for="nurse in nurses" :key="nurse.name" :label="nurse.name" :value="nurse.name"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <el-form :inline="true">
        <el-form-item label="患者病情" prop="patientcond">
          <el-input type="textarea" v-model="ruleForm.patientcond" class="illness"></el-input>
        </el-form-item>
      </el-form>
      <el-form :inline="true">
        <el-form-item label="治疗情况" prop="txstatus">
          <el-input type="textarea" v-model="ruleForm.txstatus" class="illness"></el-input>
        </el-form-item>
      </el-form>
      <el-form :inline="true">
        <el-form-item label="用药情况" prop="medstatus">
          <el-input type="textarea" v-model="ruleForm.medstatus" class="illness"></el-input>
        </el-form-item>
      </el-form>
      <el-form :inline="true">
        <el-form-item label="注意事项" prop="precautions">
          <el-input type="textarea" v-model="ruleForm.precautions" class="illness"></el-input>
        </el-form-item>
      </el-form>
      <el-form :inline="true">
        <el-form-item label="住院时间" prop="admtime">
          <el-date-picker v-model="ruleForm.admtime" type="date" placeholder="选择住院日期"
            :picker-options="pickerOptions"></el-date-picker>
        </el-form-item>
        <el-form-item label="出院时间" prop="disctime">
          <el-date-picker v-model="ruleForm.disctime" type="date" placeholder="选择出院日期"
            :picker-options="pickerOptions"></el-date-picker>
        </el-form-item>
      </el-form>
      <el-form :inline="true">
        <el-form-item label="住院地址" prop="admaddr">
          <el-input v-model="ruleForm.admaddr"></el-input>
        </el-form-item>
        <el-form-item label="住院费用" prop="hospcosts">
          <el-input v-model="ruleForm.hospcosts"></el-input>
        </el-form-item>
      </el-form>
      <el-form :inline="true">
        <el-form-item style="margin-left:300px;">
          <el-button @click="onSubmit" type="primary">立即建立</el-button>
          <el-button @click="offReset">重置</el-button>
        </el-form-item>

      </el-form>
    </el-form>
  </div>
</template>
<script type="text/ecmascript-6">
  export default {
    data() {
      return {
        ruleForm: {//住院患者信息
          name: '',
          age: '',
          sex: 2,
          idCard: '',
          homeaddr: '',
          doctor: '',
          nurse: '',
          patientcond: '',
          txstatus: '',
          medstatus: '',
          precautions: '',
          admaddr: '',
          admtime: '',
          disctime: '',
          hospcosts: ''
        },
        doctors: [],
        nurses: [],
        pickerOptions: {//时间类型转换
          disabledDate(time) {
            return time.getTime() < Date.now - 8.64e7;
          }
        }
      };
    },
    mounted() {
      this.inio();
    },
    methods: {
      inio() {
        //获取所有医生和护士
        let me = this;
        let apilogin = "http://localhost:8088/getAllDoctor"//医生信息
        this.$http.get(apilogin).then(function(response) {
          console.log(response.body);
          me.doctors = response.body.data.list;
        }, function() {
          that.$message.error('数据获取失败!');
        });
		
        let apilogin1 = "http://localhost:8088/Nurse"//护士信息
        this.$http.get(apilogin1).then(function(response) {
          console.log(response.body);
          me.nurses = response.body.data.list1;
        }, function() {
          that.$message.error('数据获取失败!');
        });
      },
      onSubmit() {
		//提交表单数据
        console.log('您修改后的参数为：', JSON.stringify(this.ruleForm));
          let that = this;

          let apilogin = "http://localhost:8088/insertPatienthosp"
          this.$http.post(apilogin,this.ruleForm).then(function(response) {
            console.log(response.body);
            that.$message.success('数据新增成功!');
          }, function() {
            that.$message.error('数据新增失败!');
          });


      },
      offReset() {
		//重置
        this.ruleForm = {
          name: '',
          age: '',
          idcard: '',
          sex: 2,
          address: '',
          doctor: '',
          nurse: '',
          illness: '',
          treatment: '',
          medication: '',
          attention: '',
          room: '',
          inTime: '',
          outTime: '',
          cost: ''
        };
        this.inio();
      }
    }
  };
</script>
<style type="text/css">
  .hospitalized {
    margin: 0 200px;
  }
  
  .hospitalized .el-input,
  .hospitalized .el-input__inner {
    width: 195px;
    display: inline-block;
  }

  .hospitalized .el-radio {
    padding-left: 35px;
  }

  .hospitalized .el-form--inline .el-form-item {
    margin-right: 150px;
  }

  .hospitalized .address {
    width: 350px;
  }

  .hospitalized .illness {
    width: 740px;
  }

  .hospitalized .h3 {
    font-size: 24px;
	margin: 0 100px;
  }

  .hospitalized .demo-ruleForm {
    margin-left: 50px;
  }
</style>
